<template>
  <n-config-provider
    v-if="status == 2"
    :locale="zhCN"
    :date-locale="dateZhCN"
    :theme-overrides="{ common: { fontWeightStrong: '600' } }"
  >
    <n-layout>
      <n-layout-header> <head-menu></head-menu> </n-layout-header>
      <n-message-provider>
        <n-dialog-provider> <router-view></router-view></n-dialog-provider>
      </n-message-provider>
    </n-layout>
  </n-config-provider>
</template>

<script>
import HeadMenu from "./components/HeadMenu.vue";
import { NConfigProvider } from "naive-ui";
import { zhCN, dateZhCN } from "naive-ui";
import { useStore } from "vuex";
import { ref } from "@vue/reactivity";

export default {
  components: { HeadMenu, NConfigProvider },
  setup() {
    const store = useStore();
    const status = ref(0);
    if (!store.state.user.is_login) {
      store.dispatch("getBadges").then(() => (status.value += 1));

      store.dispatch("getCollections").then(() => {
        status.value += 1;
      });
    }

    return {
      zhCN,
      dateZhCN,
      status,
    };
  },
};
</script>

<style>
body {
  /* background-image: url("@/assets/background.jpg"); */
  background: linear-gradient(350deg, #076585, #fff);
  background-attachment: fixed;
  background-size: cover;
}
.n-layout {
  background-color: #0000;
}
</style>